import { useState, useEffect } from 'react'
import './Com.less'
import { getdateNoTime, useCountdown } from '../until'
interface dataType {
  money: number
  title: string
  restTime?: number
  time: Array<number>
  status: string
  description: string
}
function Com(props: { data: dataType }) {
  const data: dataType = props.data
  const [h, m, s] = useCountdown(11543)

  return (
    <>
      <div className="container">
        <div className="box_left">
          <div>
            <span className="span_left">
              {parseFloat(data.money.toFixed(1))}
            </span>
            <span className="span_right">元</span>
          </div>
        </div>
        <div className="box_center">
          <div className="center_title">{data.title}</div>
          <div className="center_text">{data.description}</div>
          {data.restTime ? (
            <div>
              距结束&nbsp;
              <div className="text_time">{h}</div>
              <span> : </span>
              <div className="text_time">{m}</div>
              <span> : </span>
              <div className="text_time">{s}</div>
            </div>
          ) : (
            <div>
              有效期: {getdateNoTime(data?.time?.[0])}-
              {getdateNoTime(data?.time?.[1])}
            </div>
          )}
        </div>
        <div className="box_right">
          <span>{data.status}</span>
        </div>
      </div>
    </>
  )
}

export default Com
